<template>
	<div class="zp">
	<div style="background-color: #ffffff;border: 1px solid #f3f3f3;padding: 20px 10px;margin-top: 20px;box-shadow: azure;">
		<div class="nav">
			<img src="@/static/address.png" class="img" alt="">
			<div class="context">
				<div class="namehosp">北京市第一人民医院-东院</div>
				<div class="address" style="margin-top: 5px;">北京市大兴区**路990号</div>
			</div>
		</div>
		<div class="cont">
			<div class="phone">电话</div>
			<div class="phonename">021-5889090</div>
			<div style="margin-left: 20px;"><img src="@/static/phone.png" alt="" style="width: 16px;height: 16px;"></div>
		</div>
		<div class="cont">
			<div class="phone" style="width: 28px;height: 30px;"></div>
			<div class="phonename">021-5889090</div>
			<div style="margin-left: 20px;"><img src="@/static/phone.png" alt="" style="width: 16px;height: 16px;"></div>
		</div>
		<div class="cont" style="border: 0;">
			<div class="phone" style="width: 45px;">公交</div>
			<div class="phonename">市内乘4、5、20、24、27、49、46路车可直达东茅岭院本部。</div>
		</div>
	</div>
	<div>
	</div>
	<div style="border: 1px solid #f3f3f3;padding: 20px 10px;margin-top: 20px;">
		<div style="height: 45px;display: flex;align-items: center;justify-content: space-between;border-bottom: 1px solid rgba(242, 242, 242, 1);padding: 0px 0px 10px 0;" @click="map">
			<div style="font-size: 14px;color: #333333"><img src="@/static/map.png" alt="" style="width: 30px;height: 30px;vertical-align:middle;margin-right: 10px;">地图导航</div>
			<div><img src="@/static/addmore.png" alt="" style="width: 15px;height: 15px;"></div>
		</div>
		<div style="height: 45px;display: flex;align-items: center;justify-content: space-between;;padding: 10px 0px 0px 0;" @click="floor">
			<div style="font-size: 14px;color: #333333"><img src="@/static/map.png" alt="" style="width: 30px;height: 30px;vertical-align:middle;margin-right: 10px;">院内导航</div>
			<div><img src="@/static/addmore.png" alt="" style="width: 15px;height: 15px;"></div>
		</div>
	</div>
	</div>
</template>

<script>
	export default{
		data(){
			return{
				
			}
		},methods:{
			floor(){
				uni.navigateTo({
					url:"../../../hospital/pages/navigatio/floor"
				})
			},
			map(){
				uni.navigateTo({
					url:"../../../map/pages/mapaddress/mapaddress"
				})
			}
		}
	}
</script>

<style>
	.phonename{
		margin-left: 15px;
		font-family: 'PingFangSC-Light', 'PingFang SC Light', 'PingFang SC', sans-serif;
		    font-weight: 200;
		    font-style: normal;
		    font-size: 14px;
	}
	.phone{
		    color: #AAAAAA;
			font-family: 'PingFangSC-Light', 'PingFang SC Light', 'PingFang SC', sans-serif;
			    font-weight: 200;
			    font-style: normal;
			    font-size: 14px;
				
	}
	.cont{
		display: flex;
		align-items: center;
		height: 50px;
				border-bottom: 1px solid rgba(242, 242, 242, 1);
	}
	.address{
		    font-family: 'PingFangSC-Thin', 'PingFang SC Thin', 'PingFang SC', sans-serif;
		    font-weight: 200;
		    font-size: 12px;
		    color: #7F7F7F;
	}
	.namehosp{
		font-size: 15px;font-family: 'PingFangSC-Thin', 'PingFang SC Thin', 'PingFang SC', sans-serif;
    font-style: normal;
	}
	.img{
		width: 40px;
		margin-right: 10px;
		height: 40px;
		
	}
	.context{
		flex: 70%;
	}
	.right{
		flex: 10%;
	}
	.zp{
		padding: 0 10px;
	}
	.nav {
		display: flex;
		justify-content: center;
		align-items: center;
		height: 72px;
		padding: 5px;
		border-bottom: 1px solid rgba(242, 242, 242, 1);
	}
</style>